<!--suppress ALL -->
<include file="./Template/header.html" />

<link rel="stylesheet" type="text/css" href="/Template/css/finishedOrder.css?v=3">
<script type="text/javascript" src="/Template/js/amazeui.js"></script>
<script type="text/javascript">


    $(function() {

        //初始化页面配置
        initPage("订单确认");

        var app = new Vue({
            el: '#container',
            data: {
                number: 0,
                singlePrice: $("input[name=salePrice]").val(),
                sizeList: [],
                sizeDetailList: [],
                sizeNum: [],
                num:0,
                submit:0
            },
            methods: {
                setSalePrice: function() {
                    app.singlePrice = $("input[name=salePrice]").val();
                },
                calculate: function(num, index) {
//                    if(!isNullOrEmpty("{$agentId}")){
//                        if(num > 0 && app.number > 0){
//                            alert("每单只能订购一件商品");
//                            return false;
//                        }
//                    }
                    if((num+app.sizeNum[index])>=0) {
                        app.number += num;
                        app.sizeNum[index] += num;
                        var name = "sizeNum_"+ index;
                        document.getElementById(name).innerHTML = app.sizeNum[index];
                    }

                },
                cancelOrder: function () {
                    window.location.href = "/wechat/finishedProduct";
                    if(("{$finishedProduct.has_agent}" == "1") && !isNullOrEmpty("{$agentId}")&&("{$finishedProduct.finished_product_id}" == "1")) {
                        window.location.href = "/wechat/clubfoot/checkin";
                    }else{
                        window.location.href = "/wechat/finishedProduct";
                    }
                },
                createOrder: function() {

                    var finishedProductId = "{$finishedProduct.finished_product_id}";
                    var salePrice = $("input[name=salePrice]").val();
//                    var size = $("input[name=size]").val();
                    var number = app.number;
                    var deliveryType = $("select[name=deliveryType]").val();
                    var receiveName = $("input[name=receiveName]").val();
                    var receiveContact = $("input[name=receiveContact]").val();
                    var receiveAddress = $("input[name=receiveAddress]").val();
                    var customerName = $("input[name=customerName]").val();
                    var patientName = $("input[name=patientName]").val();
                    var patientSex = $("input[name=patientSex]").val();
                    var patientAge = $("input[name=patientAge]").val();
                    var doctorName = $("input[name=doctorName]").val();
                    var hospitalName = $("input[name=hospitalName]").val();
                    var note = $("input[name=note]").val();
                    var needInvoice = $("select[name=needInvoice]").val();
                    var invoiceName = $("input[name=invoiceName]").val();
                    var invoiceNumber = $("input[name=invoiceNumber]").val();
                    var invoiceDetail = $("input[name=invoiceDetail]").val();
                    var agentName = $("select[name=agent]").find("option:selected").text();
                    if( isNullOrEmpty(agentName) ){
                        agentName = $("input[id=agent]").val();
                    }
                    var size = app.sizeNum[0];
                    for(var i=1;i<app.sizeList.length;i++){
                        size += "/";
                        size += app.sizeNum[i];
                    }

                    if("{$finishedProduct.agent_name}" != "" && isNullOrEmpty(agentName)) {
                        alert("请选择代理商");
                        return false;
                    }

                    if(isNullOrEmpty(salePrice)) {
                        alert("请填写销售单价");
                        return false;
                    }

                        if(salePrice < parseInt("{$finishedProduct.price}") * "{$finishedProduct.discount}") {
                            alert("销售单价必须高于定价的" + "{$finishedProduct.discount}"*100 +"%");
                            return false;
                        }



                    if(number == 0) {
                        alert("请选择规格");
                        return false;
                    }

//                    if(agentName == "") {
                      if(number < 2) {
//                        if (isNullOrEmpty(customerName)) {
//                            alert("请填写客户名称");
//                            return false;
//                        }
                        if (isNullOrEmpty(patientName)) {
                            alert("请填写患者姓名");
                            return false;
                        }

                        if (isNullOrEmpty(patientSex)) {
                            alert("请选择患者性别");
                            return false;
                        }

                        if (isNullOrEmpty(patientAge)) {
                            alert("请填写患者年龄");
                            return false;
                        }

                        if (isNullOrEmpty(doctorName)) {
                            alert("请填写医生姓名");
                            return false;
                        }

                        if (isNullOrEmpty(hospitalName)) {
                            alert("请填写医院名称");
                            return false;
                        }
                    }else{
                        customerName = agentName;
                    }

                    if(isNullOrEmpty(receiveName)) {
                        alert("请填写收货人姓名");
                        return false;
                    }

                    if(isNullOrEmpty(deliveryType)) {
                        alert("请选择提货方式");
                        return false;
                    }

                    if(deliveryType == "快递"){
                        if(isNullOrEmpty(receiveAddress)) {
                            alert("请填写收货人地址");
                            return false;
                        }
                    }

                    if(isNullOrEmpty(receiveContact)) {
                        alert("请填写收货人电话");
                        return false;
                    }

                    if(!checkPhone(receiveContact)) {
                        alert("手机号位数不对");
                        return false;
                    }

                    if(needInvoice == 1) {
                        if(isNullOrEmpty(invoiceName)) {
                            alert("请填写发票抬头");
                            return false;
                        }
                        if(isNullOrEmpty(invoiceNumber)) {
                            alert("请填写纳税人识别号");
                            return false;
                        }
                    }
                    if(needInvoice != -1) {
                        if(isNullOrEmpty(invoiceDetail)) {
                            alert("请填写发票明细");
                            return false;
                        }
                    }

                    var data = {};

                    data.finishedProductId = finishedProductId;
                    data.salePrice = salePrice;
                    data.size = size;
                    data.number = number;
                    data.deliveryType = deliveryType;
                    data.receiveName = receiveName;
                    data.receiveContact = receiveContact;
                    data.receiveAddress = receiveAddress;
                    data.customerName = customerName;
                    data.patientName = patientName;
                    data.patientSex = patientSex;
                    data.patientAge = patientAge;
                    data.doctorName = doctorName;
                    data.hospitalName = hospitalName;
                    data.note = note;
                    data.needInvoice = needInvoice;
                    data.invoiceName = invoiceName;
                    data.invoiceNumber = invoiceNumber;
                    data.invoiceDetail = invoiceDetail;
                    data.agentName = agentName;

                    if(confirm("请确认是否提交工单？")){
                        $.ajax({
                            url:"/wechat/finishedProduct/createOrder",
                            type:"post",
                            data:data,
                            dataType:"JSON",
                            beforeSend:function(){
                                $("#loadingToast").show();
                                $("#submitBtn").hide();
                            },
                            complete:function(){
                                $('#loadingToast').hide();
                            },
                            success:function(data){
                                if(data.code != 200) {
                                    alert(data.msg);
                                    app.submit = 1;
                                    window.localStorage.setItem("finishedOrderData", null);
                                    window.localStorage.removeItem("finishedOrderData");
                                    window.location.href = "/wechat/finishedProduct/orderList";
                                }else{
                                    app.submit = 1;
                                    window.localStorage.setItem("finishedOrderData", null);
                                    window.localStorage.removeItem("finishedOrderData");
                                    window.location.href = "/wechat/finishedProduct/orderList";
                                }

                            },
                            error:function(data){
                                app.submit = 1;
                                window.localStorage.setItem("finishedOrderData", null);
                                window.localStorage.removeItem("finishedOrderData");
                                window.location.href = "/wechat/finishedProduct/orderList";
                            }
                        })
                    }else{
                        return;
                    }


                }
            }
        })

        if("{$finishedProduct.has_agent}" != "1"){
//            $("input[name=salePrice]").val("{$finishedProduct.price}");
            $(".item.salePrice").show();
        }

        var size = "{$finishedProduct.size}"
        app.sizeList = size.split("/");
        var sizeDetailList = "{$finishedProduct.size_detail}"
        app.sizeDetailList = sizeDetailList.split("/");
        for(var i=0;i<app.sizeDetailList.length;i++){
            if(app.sizeDetailList[i] != ""){
                app.sizeDetailList[i] = "[" + app.sizeDetailList[i] + "] -- ";
            }

        }

        for(var j=0;j<app.sizeList.length;j++){
            app.sizeNum[j] = 0;
        }

        var isPageHide = false;
        window.addEventListener('pageshow', function () {
            if (isPageHide) {
                window.location.reload();
            }
        });
        window.addEventListener('pagehide', function () {
            isPageHide = true;
            var data = {};
            var finishedProductId = "{$finishedProduct.finished_product_id}";
            var salePrice = $("input[name=salePrice]").val();
//            var size = $("input[name=size]").val();
            var number = app.number;
            var deliveryType = $("select[name=deliveryType]").val();
            var receiveName = $("input[name=receiveName]").val();
            var receiveContact = $("input[name=receiveContact]").val();
            var receiveAddress = $("input[name=receiveAddress]").val();
            var customerName = $("input[name=customerName]").val();
            var patientName = $("input[name=patientName]").val();
            var patientSex = $("input[name=patientSex]").val();
            var patientAge = $("input[name=patientAge]").val();
            var doctorName = $("input[name=doctorName]").val();
            var hospitalName = $("input[name=hospitalName]").val();
            var note = $("input[name=note]").val();
            var needInvoice = $("select[name=needInvoice]").val();
            var invoiceName = $("input[name=invoiceName]").val();
            var invoiceNumber = $("input[name=invoiceNumber]").val();
            var invoiceDetail = $("input[name=invoiceDetail]").val();
            var agentName = $("select[name=agent]").find("option:selected").text();
            var needPatient = $("input[name=needPatient]").val();
            if(isNullOrEmpty(agentName)){
                agentName = $("input[id=agent]").val();
            }
            var size = app.sizeNum[0];
            for(var i=1;i<app.sizeList.length;i++){
                size += "/";
                size += app.sizeNum[i];
            }

            data.finishedProductId = finishedProductId;
            data.salePrice = salePrice;
            data.size = size;
            data.number = number;
            data.deliveryType = deliveryType;
            data.receiveName = receiveName;
            data.receiveContact = receiveContact;
            data.receiveAddress = receiveAddress;
            data.customerName = customerName;
            data.patientName = patientName;
            data.patientSex = patientSex;
            data.patientAge = patientAge;
            data.doctorName = doctorName;
            data.hospitalName = hospitalName;
            data.note = note;
            data.needInvoice = needInvoice;
            data.invoiceName = invoiceName;
            data.invoiceNumber = invoiceNumber;
            data.invoiceDetail = invoiceDetail;
            data.agentName = agentName;
            data.needPatient = needPatient;

            if(app.submit == 0){
                localStorage.setItem("finishedOrderData", JSON.stringify(data));
            }
        });

        $(".item select").change(function() {
            var value = $(this).find("option:selected").text();
            $(this).prev().val(value);
        });

        $("input[name=salePrice]").change(function() {
            $(".size-detail").show();
        });

        $("select[name=agent]").change(function() {
            $(".size-detail").show();
            var agentArr = $("select[name=agent]").val().split(",");
            var agentPrice = agentArr[0];
            var agentContact= agentArr[1];
            var agentTel = agentArr[2];
            var agentAddress = agentArr[3];
            var agentInvoiceName = agentArr[4];
            var agentInvoiceNumber = agentArr[5];
            var needPatient = agentArr[6];
            var fixedPrice = agentArr[7];
            if(needPatient != "1"){
                $(".item.salePrice").hide();
                $(".customer-info.agent").hide();
                $(".patient-info.agent").hide();
                $(".doctor-info.agent").hide();
                $("input[name=patientName]").val("");
            }else{
                $(".item.salePrice").show();
                $(".customer-info.agent").show();
                $(".patient-info.agent").show();
                $(".doctor-info.agent").show();

            }
            if(fixedPrice != "1"){
                $(".item.salePrice").show();
            }else{
                $(".item.salePrice").hide();
            }

            document.getElementById("productPrice").innerHTML = "¥ " + agentPrice;
            $("input[name=salePrice]").val(agentPrice);
            app.singlePrice = agentPrice;
            $("input[name=receiveName]").val(agentContact);
            $("input[name=receiveContact]").val(agentTel);
            $("input[name=receiveAddress]").val(agentAddress);
            $("input[name=invoiceName]").val(agentInvoiceName);
            $("input[name=invoiceNumber]").val(agentInvoiceNumber);
            $("input[name=needPatient]").val(needPatient);
        });

        $("select[name=needInvoice]").change(function() {
            if($(this).val() == 1) {
                $(".item.invoice").show();
            } else {
                $(".item.invoice").hide();
            }
            if($(this).val() == -1) {
                $(".item.invoiceDetail").hide();
            } else {
                $(".item.invoiceDetail").show();
            }
        });

        $("select[name=deliveryType]").change(function() {
            if($(this).val() == "自提") {
                $(".item.receiveAddress").hide();
            } else {
                $(".item.receiveAddress").show();
            }
        });

        $("img.icon-up").click(function() {

            $(this).hide();
            $("img.icon-down").show();

            $(".size-detail").toggle();

        });

        $("img.icon-down").click(function() {

            $(this).hide();
            $("img.icon-up").show();

            $(".size-detail").toggle();

        });

        var leftData = window.localStorage.getItem("finishedOrderData");
        if(!isNullOrEmpty(leftData)) {
            var finishedOrderData = JSON.parse(leftData);
            if(isNullOrEmpty(finishedOrderData.agentName) && ("{$finishedProduct.has_agent}" == "1")){
                return;
            }
            if(!isNullOrEmpty(finishedOrderData)) {
                if(finishedOrderData.finishedProductId == "{$finishedProduct.finished_product_id}") {
                    $("input[id=agent]").val(finishedOrderData.agentName);
                    app.number = finishedOrderData.number;
                    app.singlePrice = finishedOrderData.salePrice;
                    $("input[name=salePrice]").val(finishedOrderData.salePrice);
//                    $("input[name=size]").val(finishedOrderData.size);
                    app.sizeNum = finishedOrderData.size.split("/");
                    app.sizeNum=app.sizeNum.map(function(data){
                        return +data;
                    });
                    $("select[name=deliveryType]").val(finishedOrderData.deliveryType);
                    $("input[name=receiveName]").val(finishedOrderData.receiveName);
                    $("input[name=receiveContact]").val(finishedOrderData.receiveContact);
                    $("input[name=receiveAddress]").val(finishedOrderData.receiveAddress);
                    $("input[name=customerName]").val(finishedOrderData.customerName);
                    $("input[name=patientName]").val(finishedOrderData.patientName);
                    $("input[name=patientSex]").val(finishedOrderData.patientSex);
                    $("input[name=patientAge]").val(finishedOrderData.patientAge);
                    $("input[name=doctorName]").val(finishedOrderData.doctorName);
                    $("input[name=hospitalName]").val(finishedOrderData.hospitalName);
                    $("input[name=note]").val(finishedOrderData.note);
                    $("select[name=needInvoice]").val(finishedOrderData.needInvoice);
                    $("input[name=invoiceName]").val(finishedOrderData.invoiceName);
                    $("input[name=invoiceNumber]").val(finishedOrderData.invoiceNumber);
                    $("input[name=invoiceDetail]").val(finishedOrderData.invoiceDetail);
                    $("input[name=needPatient]").val(finishedOrderData.needPatient);

                    $("input#transport").val(finishedOrderData.deliveryType);

                    var value = $("select[name=needInvoice]").find("option:selected").text();
                    $("select[name=needInvoice]").prev().val(value);

                    if($("select[name=needInvoice]").val() == 1) {
                        $(".item.invoice").show();
                    } else {
                        $(".item.invoice").hide();
                    }
                    if($("select[name=needInvoice]").val() == -1) {
                        $(".item.invoiceDetail").hide();
                    } else {
                        $(".item.invoiceDetail").show();
                    }

                    if($("select[name=deliveryType]").val() == "自提") {
                        $(".receiveAddress").hide();
                    } else {
                        $(".receiveAddress").show();
                    }
                    if(finishedOrderData.agentName == "员工下单"){
                        $(".item.salePrice").show();
                    }else{
                        $(".item.salePrice").hide();
                    }
                    if(("{$finishedProduct.has_agent}" == "1") && (finishedOrderData.needPatient != "1")) {
                        $(".item.salePrice").hide();
                        $(".customer-info.agent").hide();
                        $(".patient-info.agent").hide();
                        $(".doctor-info.agent").hide();

                        document.getElementById("productPrice").innerHTML = "¥ " + finishedOrderData.salePrice;
                    }
                } else {
                    window.localStorage.removeItem("finishedOrderData");
                }

            }

        }else{
            $("input[id=agent]").val("");
            $("input[name=salePrice]").val("");
            $("select[name=deliveryType]").val("");
            $("input[name=receiveName]").val("");
            $("input[name=receiveContact]").val("");
            $("input[name=receiveAddress]").val("");
            $("input[name=customerName]").val("");
            $("input[name=patientName]").val("");
            $("input[name=patientSex]").val("");
            $("input[name=patientAge]").val("");
            $("input[name=doctorName]").val("");
            $("input[name=hospitalName]").val("");
            $("input[name=note]").val("");
            $("select[name=needInvoice]").val("");
            $("input[name=invoiceName]").val("");
            $("input[name=invoiceNumber]").val("");
            $("input[name=invoiceDetail]").val("");
            $("input#transport").val("");
            $("select[name=needInvoice]").val(-1);
            $("input[name=needPatient]").val("");
        }
    })

</script>

<div class="container" id="container">
    <div class="product-detail">
        <img class="product-img" src="{$finishedProduct.image_url}" alt="product">
        <div class="detail-info">
            <p class="product-price" id="productPrice">￥{$finishedProduct.price}</p>
            <p class="product-name">{$finishedProduct.name}</p>
            <p class="number">×{{number}}</p>
            <p class="buy-time">订购日期：{:date("Y-m-d")}</p>
        </div>
    </div>
    <div class="number-and-transport">
        <if condition="$finishedProduct['has_agent'] eq '1'">
            <div class="item">
                <span>代理商</span>
                <input id="agent" value="" type="text" readonly placeholder="请选择代理商">
                <select name="agent">
                    {:getAgentSelectOptionHtml($finishedProduct['finished_product_id'], $agentId)}
                </select>
                <img class="icon-right gender" src="/Template/images/icon-right.png" alt="">
            </div>
        </if>
        <div class="item salePrice" style="display: none;">
            <span>销售单价</span>
            <input type="text" name="salePrice" value="{$finishedProduct.price}" placeholder="请填写销售单价" v-on:blur="setSalePrice()">
            <img class="icon-right" src="/Template/images/icon-right.png" alt="">
        </div>
        <div class="size">
            <div class="item" style="height:3rem;border-bottom:0px">
                <span>规格型号</span>

                <img class="icon-up" src="/Template/images/icon-up.png" alt="">
                <img class="icon-down" src="/Template/images/icon-down.png" alt="">
                <span style="float: right;">{$finishedProduct.size_comment}</span>
            </div>
            <br/>
            <div v-for="size in sizeList" class="size-detail" style="display: none">
                <div class="item-small">
                    <span class="sum-number">{{sizeDetailList[$index]}}{{size}}</span>
                    <span class="number-change">
                            <img class="icon-minus" v-on:click="calculate(-1, $index)" src="/Template/images/minus.png" alt="">
                            <span class="sum-number" id="sizeNum_{{ $index }}">{{sizeNum[$index]}}</span>
                            <img class="icon-plus" v-on:click="calculate(1, $index)" src="/Template/images/plus.png" alt="">
                    </span>
                </div>
            </div>
        </div>
    </div>
    <!--div class="customer-info agent">
        <div class="item">
            <span>客户名称</span>
            <input type="text" name="customerName" placeholder="请填写客户名称">
            <img class="icon-right" src="/Template/images/icon-right.png" alt="">
        </div>
    </div-->
    <div class="patient-info agent">
        <div class="item">
            <span>患者姓名</span>
            <input type="text" name="patientName" placeholder="多个患者可不填">
            <img class="icon-right" src="/Template/images/icon-right.png" alt="">
        </div>
        <div class="item">
            <span>患者性别</span>
            <input name="patientSex" type="text" readonly placeholder="多个患者可不填">
            <select name="patientSex">
                <option value="">请选择</option>
                <option value="男">男</option>
                <option value="女">女</option>
            </select>
            <img class="icon-right gender" src="/Template/images/icon-right.png" alt="">
        </div>
        <div class="item">
            <span>患者年龄</span>
            <input type="text" name="patientAge" placeholder="多个患者可不填">
            <img class="icon-right" src="/Template/images/icon-right.png" alt="">
        </div>
        <input type="text" style="display: none;" name="needPatient">
    </div>
    <div class="doctor-info agent">
        <div class="item">
            <span>医生</span>
            <input type="text" name="doctorName" placeholder="多个患者可不填">
            <img class="icon-right" src="/Template/images/icon-right.png" alt="">
        </div>
        <div class="item">
            <span>医院</span>
            <input type="text" name="hospitalName" placeholder="多个患者可不填">
            <img class="icon-right" src="/Template/images/icon-right.png" alt="">
        </div>
    </div>
    <div class="address-info">
        <div class="item">
            <span>提货方式</span>
            <input id="transport" value="快递" type="text" readonly placeholder="请选择提货方式">
            <select name="deliveryType">
                <option value="快递">快递</option>
                <option value="自提">自提</option>
            </select>
            <img class="icon-right gender" src="/Template/images/icon-right.png" alt="">
        </div>
        <div class="item">
            <span>收货人姓名</span>
            <input type="text" name="receiveName" placeholder="请填写收货人姓名">
            <img class="icon-right" src="/Template/images/icon-right.png" alt="">
        </div>
        <div class="item">
            <span>收货人电话</span>
            <input type="text" name="receiveContact" placeholder="请填写收货人电话">
            <img class="icon-right" src="/Template/images/icon-right.png" alt="">
        </div>
        <div class="item receiveAddress">
            <span>收货地址</span>
            <input type="text" name="receiveAddress" placeholder="请填写收货地址">
            <img class="icon-right" src="/Template/images/icon-right.png" alt="">
        </div>
    </div>

    <div class="product-need">
        <div class="item">
            <span>留言备注</span>
            <input type="text" name="note" placeholder="请编辑备注信息">
            <img class="icon-right" src="/Template/images/icon-right.png" alt="">
        </div>
        <div class="item">
            <span>是否开发票</span>
            <input type="text" value="不开发票" name="needInvoice" readonly placeholder="">
            <select name="needInvoice" class="invoice-choose">
                <option value="-1">不开发票</option>
                <option value="1">公司发票</option>
                <option value="2">个人发票</option>
            </select>
            <img class="icon-right" src="/Template/images/icon-right.png" alt="">
        </div>
        <div class="item invoice" style="display: none;">
            <span>发票抬头</span>
            <input name="invoiceName" type="text" placeholder="请填写发票抬头">
            <img class="icon-right" src="/Template/images/icon-right.png" alt="">
        </div>
        <div class="item invoice" style="display: none;">
            <span>纳税人识别号</span>
            <input name="invoiceNumber" type="text" placeholder="请填纳税人识别号">
            <img class="icon-right" src="/Template/images/icon-right.png" alt="">
        </div>
        <div class="item invoiceDetail" style="display: none;">
            <span>发票明细</span>
            <input name="invoiceDetail" type="text" placeholder="请填写发票明细" value="{$finishedProduct.invoice_detail}">
            <img class="icon-right" src="/Template/images/icon-right.png" alt="">
        </div>
    </div>
    <div class="order-operation">

        <p>共{{number}}件商品  合计：<span>￥{{number*singlePrice}}</span> </p>
        <button class="cancel-order" v-on:click="cancelOrder">返回</button>
        <button id="submitBtn" class="submit-order" v-on:click="createOrder">提交订单</button>
    </div>
</div>
<include file="./Template/footer.html" />